<template>
    <div class="game">
        <h2>游戏列表</h2>
        <slot name="ming" :games="games"></slot>        <!-- 将games传递给父组件 -->
    </div>
</template>

<script lang="ts" setup name="Game">
    import {reactive} from "vue";
    //数据
    let games = reactive([
        {id:"lsfdig01",name:"原神"},
        {id:"lsfdig02",name:"星穹铁道"},
        {id:"lsfdig03",name:"绝区零"},
        {id:"lsfdig04",name:"鸣潮"}
    ])
</script>

<style scoped>
    .game{
        width: 200px;
        height: 300px;
        background-color: skyblue;
        border-radius: 10px;
        box-shadow: 0 0 10-x;
    }
    h2{
        background-color: orange;
        text-align: center;
        font-size: 20px;
        font-weight: 800px;
    }
</style>